<template>
	<uv-navbar
	  :fixed="false"
	  @leftClick="$onClickLeft"
	  bgColor="#09b4f1"
	>
		<template v-slot:left>
			<uv-icon name="arrow-left" size="19" color="#ffffff"></uv-icon>
		</template>
		<template v-slot:center>
			<text style="color:#ffffff">{{title}}</text>
		</template>
	</uv-navbar>
	<view class="bg-white">
		<view>
			<uv-tabs :list="list" @click="handleSelect" :scrollable="false"></uv-tabs>
		</view>
		<view>
			<uni-table border stripe emptyText="暂无更多数据">
				<uni-tr>
					<uni-th  align="center" width="50">排名</uni-th>
					<uni-th  align="center" width="120">姓名</uni-th>
					<uni-th  align="center" width="100">数量</uni-th>
					<uni-th  align="center">金额</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in data" :key="index">
					<uni-td align="center">{{ index + 1 }}</uni-td>
					<uni-td align="center">{{ item.nickname }}</uni-td>
					<uni-td align="center">{{ item.count }}</uni-td>
					<uni-td align="center">{{ item.money }}</uni-td>
				</uni-tr>
			</uni-table>
		</view>
	</view>
</template>

<script setup>
import {
  ref,reactive
} from 'vue'
import {
  getContractRank,
  getReceivablesRank
} from '@/api/index'
import { useMainStore } from '@/store/store'
import { storeToRefs } from 'pinia'
import { onLoad,onShow} from '@dcloudio/uni-app'

const main = useMainStore()
const { indexCount } = storeToRefs(main)
const title = ref('排行榜')
const relation = ref('my')
const data = ref([])
const list = ref( 
	[{
		name: '订单排行',
		value: 'my'
	}, {
		name: '回款排行',
		value: 'sub'
	}]
)
	

onShow(()=>{
	getData()
})


const gopage = (url) => {
	uni.navigateTo({
		url
	})
}

const handleSelect = (key) => {
  relation.value = key.value
  getData()
}

const getData = async() => {
	if(relation.value == 'my'){
		data.value = await getContractRank()
	}else{
		data.value = await getReceivablesRank()
	}
	
}



	
</script>

<style lang="scss" scoped>
	

</style>
